<!-- 角色权限设置 -->
<template>
  <div>
    <header class="power-header">
      <div class="icon"><i class="iconfont icon-manage"></i></div>
      <!-- <div class="role" @click="goRole">{{name}}<i class="iconfont icon-more"></i></div> -->
      <p class="role-name">{{name}}</p>
    </header>
    <h2 class="form-tit-row">开通角色功能</h2>
    <!-- 有权限start -->
    <div class="form-wrap mb30" v-for="item in items">
      <div class="form-wrap-row" >
        <div class="line displayflex" @click="toDet(item)">
          <div class="label">{{item.PageTitle}}</div>
          <span class="flex1 txt-rit gray">{{item.IsHide}}</span>
         <i class="iconfont icon-more"></i>
        </div>
      </div>
      <!-- <div class="privi-detail displayflex mb30">
        <span class="label">已开通权限</span>
        <div class="flex1 txt-rit item-color plr20">
          {{item.DataTableCaption}}
        </div>
      </div> -->
    </div>
    <!-- 有权限end -->
    <!-- 没有权限start -->
    <!-- <div class="form-wrap mb30">
      <div class="form-wrap-row">
        <div class="line displayflex" @click="toDet">
          <div class="label">受理订单</div>
          <div class="flex1 txt-rit">
            <i class="iconfont icon-more"></i>
          </div>
        </div>
      </div>
    </div>
    <div class="form-wrap mb30">
      <div class="form-wrap-row">
        <div class="line displayflex" @click="toDet">
          <div class="label">订单追踪</div>
          <div class="flex1 txt-rit">
            <i class="iconfont icon-more"></i>
          </div>
        </div>
      </div>
    </div> -->
    <!-- 没有权限end -->
  </div>
</template>
<script>
export default {
  data() {
    return {
      items: [],
      binditems:[],
      rolename:'Salesman',
      name:'业务员',
      showitems:[],
    };
  },
  created() {
    if (this.$route.query.type) {
      this.rolename = this.$route.query.type;
      this.name =this.$route.query.name;
    }
    this.getData();
    
  },
  mounted() {
    this.$nextTick(function() {

    });
  },
  methods: {
    toDet(item) {
      this.$router.push({
        path: "/user/power/powerset",
        query:{id:item.PageID,IsHide:item.IsHide,name:item.PageTitle,RoleName:this.rolename,typename:this.name}
      });
    },
    getData() {
      var self = this;
      var userinfo = JSON.parse(localStorage.userinfo);
      var query = {
        DataTableCaption: ''
      };
      //查询全部菜单
      this.Ajax.post("SearchMfplatformmenubacies", query).then(function(resp) {
        if (resp.IsSuccess) {
          if (resp.Datas.length > 0) {
            self.items = resp.Datas;
            self.getbindData();
          }
        } else {
          self.Toast({
            message: resp.ErrorMessage || "操作异常，请稍后重试"
          });
        }
      });
    },
    getbindData() {
      var self = this;
      var userinfo = JSON.parse(localStorage.userinfo);
      var query = {
        TenantGuid: userinfo.TenantGUID,
        CorpGuid:userinfo.CorpGuid,
        RoleName:this.rolename,
      };
      //查询全部菜单
      this.Ajax.post("SearchMfmenubuttonbacies", query).then(function(resp) {
        if (resp.IsSuccess) {
          if (resp.Datas.length > 0) {
              //self.binditems = resp.Datas;
              resp.Datas.forEach(function(element) {
                JSON.parse(element.ConfigRights).forEach(function(con) {
                  self.binditems.push(con.id);
                }, this);
            }, this);

            self.binditems.forEach(function(bind) {
              self.items.forEach(function(item) {
                  if (bind == item.PageID) {
                    item.IsHide='已开通';
                    self.showitems.push(item);
                  }
              }, this);
            }, this); 
          }
        } else {
          self.Toast({
            message: resp.ErrorMessage || "操作异常，请稍后重试"
          });
        }
      });
    }
  }
};
</script>